<template>
  <div>
      <h2 align="center">会员登录页面</h2>
      <table class="table table-bordered">
        <tr>
          <td align="right">帐号：</td>
          <td>
            <input type="text" v-model="state.userName">
          </td>
        </tr>
        <tr>
          <td align="right">密码：</td>
          <td>
            <input type="password" v-model="state.userPwd">
          </td>
        </tr>
        <tr>
          <td align="right"></td>
          <td>
            <input type="button" value="登录" @click="login">
          </td>
        </tr>
      </table>
  </div>
</template>

<script setup lang="ts">
import {reactive,toRefs,onMounted}  from 'vue'
import  axios from 'axios'
import { useRouter,useRoute} from 'vue-router'
import { useUserStore} from '../stores/user'


const route = useRoute();
const router = useRouter();
const userStore = useUserStore()

//数据

let  data:any = reactive({
  state:{
    userName:'',
    userPwd:''
  }
})

let {state} = toRefs(data)

//函数--------------------------

//登录
const login = ()=>{
  //1.非空验证
  if(state.value.userName == ""){
    alert("帐号不能为空");
    return;
  }
  if(state.value.userPwd == ""){
    alert("密码不能为空");
    return
  }
  //2.发送网络请求
  let obj = {
    userName:state.value.userName,
    userPwd:state.value.userPwd
  }

  axios({
    url:'/api/Test/GetMemberLogin',
    method:'get',
    params:obj
  })
  .then(res=>{
    console.log(res);
    if(res.data.data == null){
      alert("没有这个会员");
      return
    }else{
      alert("登录成功");
      userStore.userInfo = res.data.data
      router.push("/memberInfo")
    }
    
  })
  .catch(err=>{
    console.log(err);
    
  })
}
</script>

<style scoped>

</style>